<template>
    <div id="cashApply">
        <div class="topbox">
            <div class="txt">
                <p v-show="lang=='zh'">工作人员将在3个工作日内为您安排提现！</p>
                <p v-show="lang=='en'">The staff will arrange a cash offer for you within 3 working days.Please be patient!</p>
                <p v-show="lang=='zh'">请耐心等待！</p>
            </div>
        </div>
        <div class="linebox">
            <div v-show="lang=='zh'" class="txt">银行卡卡号</div>
            <div v-show="lang=='en'" class="txt">number</div>
            <div class="num" v-show="lang=='zh'">{{bank_name}}(尾号{{bank_number}})</div>
            <div class="num" v-show="lang=='en'">{{bank_name}}</div>
           
        </div> 
         <div class="linebox" v-show="lang=='en'">
              <div class="num" >(Tail{{bank_number}})</div>
         </div>
        <div class="linebox">
            <div v-show="lang=='zh'" class="txt">提现金额</div>
            <div v-show="lang=='en'" class="txt">withdraw</div>
            <div class="num">￥{{withdraw_money}}</div>
        </div> 
        <div v-show="lang=='zh'" class="submit" @click="gotomybalance">我知道了</div>
        <div v-show="lang=='en'" class="submit"  @click="gotomybalance">I knew</div>
    </div>
</template>
<script>
import {Toast} from 'vant';
import { getcardTypeList } from '@/api/my/card';
export default {
    name:'cashApply',
    //声明组件
    components:{
        [Toast.name]:Toast,
    },
    data (){
        return{
            withdraw_money:0,//提现金额
            bank_number:0,//银行卡尾号
            id:0,//银行ID
            lang:'zh',
            userId:0,
            bank_name:'',//银行名称
        }
    },
    //实例创建完成后被立即调用
    created (){
        //获取用户ID
        this.getUserId();
        //获取语言环境
        this.getLang();
        //获取提现金额
        this.getwithdraw_money();
        //获取银行卡尾号
        this.getbank_number();
        //获取银行ID
        this.getid();
        //获取银行类型列表 提取ID对应的银行名称
        this.getName();
    },
    //监听
    watch:{

    },
    //计算属性
    computed:{

    },
    //
    methods:{
        //获取用户ID
    	getUserId(){
            if(this.$route.query.userId && this.$route.query.userId > 0){
    			this.userId = this.$route.query.userId;
    		}else{
                //获取缓存内的用户ID
                this.userId = window.localStorage.getItem("userId");
            }
        },
        //获取语言环境
         getLang(){
            if(this.$route.query.lang){
    			this.lang = this.$route.query.lang;
    		}
        },
         //获取提取金额
    	getwithdraw_money(){
            if(this.$route.query.withdraw_money ){
    			this.withdraw_money = this.$route.query.withdraw_money;
            }
        },
         //获取银行卡尾号
    	getbank_number(){
            if(this.$route.query.bank_number){
    			this.bank_number = this.$route.query.bank_number;
            }
        },
         //获取银行id
    	getid(){
            if(this.$route.query.id){
    			this.id = this.$route.query.id;
            }
        },
        //获取银行卡所属银行名称
        getName(){
            getcardTypeList(this.lang).then(res=>{
				if(res.code==200){
					if(res.data.length > 0){
                        var list = res.data;
                        for(let i=0;i<list.length;i++){
                            if(list[i].id == this.id){
                                this.bank_name = list[i].bank_name;
                            }
                        }
					}
                }else{
                    Toast(res.msg)
                }
            });
        },
        gotomybalance(){
            //返回上一页并刷新
            let para = {};
            para.isRefresh = true;
            this.interaction.hReturn(para);	
        }

    }
    
}
</script>

<style lang="stylus" scoped>
*{
    box-sizing :border-box;
}
#cashApply{
    height :100%;
    background-color :#fff;
    .topbox{
        width :100%;
        height :4.666667rem;
        text-align :center;
        background:url("http://img.xianyufanshen.net//my/beijing_shenqingchenggong@2x.png") no-repeat;
        background-size :100% 100%;
        position :relative;
        .txt{
            width :100%;

            position :absolute;
            bottom  :.8rem;
            //left :50%;
            //margin-left :-3.066667rem;
            font-family:PingFangSC-Regular;
            font-size:.346667rem;
            color:#ffffff;
            letter-spacing:0;
            text-align:center;
            line-height:.533333rem;
            p{
                width :100%;
                height :auto;
                text-align :center;
            }
        }
    }
    .linebox{
        width :100%;
        height :1.253333rem;
        padding :0 .266667rem;
        border-bottom :.026667rem solid #f1f1f1;
        .txt{
            height :1.253333rem;
            line-height :1.253333rem;
            float :left;
            font-family:PingFangSC-Regular;
            font-size:.373333rem;
            color:#a2a2a2;
            letter-spacing:.0104rem;
            text-align:left;
        }
        .num{
            height :1.253333rem;
            line-height :1.253333rem;
            float :right;
            font-family:PingFangSC-Regular;
            font-size:.373333rem;
            color:#494949;
            letter-spacing:.0104rem;
            text-align:right;
        }
    }
    .submit{
        width :6.533333rem;
        height :1.066667rem;
        line-height :1.066667rem;
        text-align :center;
        margin : 1.2rem auto 0;
        background:#ffffff;
        border:.053333rem solid #cb9c57;
        border-radius:2.666667rem;
        font-family:PingFangSC-Medium;
        font-size:.373333rem;
        color:#cb9c57;
        letter-spacing:.005067rem;
        text-align:center;
    }
}
</style>


